import React from 'react'
import PropTypes from 'prop-types'

const Todo = ({onClick,onDelClick,completed,text})=>(
    <li>
        <span onClick={onClick} style={ {textDecoration: completed?"line-through":"none"} }>{text}</span>
        <span onClick={onDelClick} style={{marginLeft:'20px'}}>×</span>
    </li>
)

Todo.propTypes = {
    onClick: PropTypes.func.isRequired,
    onDelClick: PropTypes.func.isRequired,
    completed: PropTypes.bool.isRequired,
    text: PropTypes.string.isRequired
}

export default Todo